<template>
  <div id="index_container">
      <div id="sreach_wrap">
          <search></search>
      </div>
      <div id="map_wrap">
          <map-container></map-container>
          
      </div>
  </div>
</template>

<script>
import MapContainer from '@/components/MapContainer/MapContainer.vue'
import Search from '@/components/Search/Search.vue'
export default {
  components: { MapContainer, Search },

}
</script>

<style lang="less" scoped>
  #index_container{
      height: 100%;
      width: 100%;
      position: relative;
  }
  #map_wrap{
      height: 60%;
      width: 60%;
      position: absolute;
        top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
  }
  #sreach_wrap{
    top: 10%;
    left: 50%;
    height: 60px;
    width: 400px;
    transform: translate(-50%,-50%);
      position: absolute;
  }
</style>